<template>
    <div id="Login">
        <div id="login">
            <p class="fa fa-angle-left" @touchstart="backBtn"></p>
            <p><img src="../../static/image/logo.png"></p>
            <p>手机登录<input type="radio" v-model="type" value="phoneLogin">&emsp;&emsp;密码登录<input type="radio" v-model="type" value="pswLogin"></p>
        </div>
        <qwe :is="type"></qwe>
       <router-link to="/Mine/Login/Regist"> <div id="regist">注册</div></router-link>
    </div>
</template>

<script>
import phoneLogin from '../components/phoneLogin';
import pswLogin from '../components/pswLogin';
export default {
    data(){
        return{
            type:"phoneLogin",
        }
    },
    components:{
        phoneLogin,
        pswLogin
    },
    methods:{
        backBtn(){
            history.back();
        }
    }
}
</script>

<style scoped>
#Login{
    width:100%;
    height: 100%;
    background-color:#eeeeee;
}
#login{
    width:100%;
    height:200px;
    border-bottom: 1px solid #dddddd;
}
#login p:nth-of-type(1){
    height: 30%;
    color:#666666;
    font-size: 40px;
    position: relative;
    left:10px;
    top:6px;
}
#login p:nth-of-type(2){
    height: 40%;
   text-align: center;
}

#login img{
    width:45%;
      z-index: 20;
}
#login p:nth-of-type(3){
   text-align: center;
   position: relative;
   top:30px;
   font-size: 25px;
}

#regist{
    font-size: 14px;
    position: absolute;
    right: 20px;
    bottom:180px;
}
</style>